<template>
	<view class="">
		<!-- <uni-nav-bar color="#333" @clickLeft="leftFun" :border="false" left-icon="left" backgroundColor="#fff"
			title="物流详情"></uni-nav-bar> -->
		<!--pages/logisticsDetail/logisticsDetail.wxml-->
		<view class="page">
			<view class="info-box flex_m">
				<view>
					{{companyName}}
				</view>
				<view class="flex_m ml40">
					{{deliveryId}}
					<view catchtap="onCopy">
						<image class="copy-img" src="../../static/images/ic_copy.png" mode="scaleToFill"></image>
					</view>
					<!-- <van-icon class="ml20" name="cart-o" info="{{info}}" color="#2f9df2" size="25px" bind:click="onCopy"  /> -->
				</view>
			</view>
			<view class="steps-box mt40">
				<scroll-view scroll-y="true" style="height: 1200rpx;" enable-back-to-top="true">
					<cc-defineStep :colors="colors" :stepData="logisticsRouteList"></cc-defineStep>
				</scroll-view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		qzApi
	} from '@/config/request.js';
	export default {
		data() {
			return {
				logisticsRouteList: [],
				colors: "#fa436a",
				stepData: [
				],
				orderId: 0,
				activeRoute: '',
				companyName:"",
				deliveryId:''
			}
		},
		methods: {
			async logisticsFun(e) {
				const res=await qzApi.getLogisticsInfo(e);
				if (res && res.data && Array.isArray(res.data.logisticsRouteOrderVos)) {
				  let arr = this.exchangeDataStructure(res.data.logisticsRouteOrderVos)
				 // arr = arr.concat(this.exchangeDataStructure(res.data.logisticsRouteOrderVos))
				arr[0].isNow=1
				this.companyName=res.data.companyName;
				this.deliveryId=res.data.deliveryId;
				this.logisticsRouteList=arr;
				
				console.log(this.logisticsRouteList)
				}
			},
			exchangeDataStructure(logisticsRoutes) {
			  console.log(logisticsRoutes)
			  if (Array.isArray(logisticsRoutes)) {
			    let array = []
			    logisticsRoutes.reverse().forEach((element,index) => {
			      array.push({
			        text: element.content,
			        desc: element.createdAt,
			      })
			    });
				
				console.log(array)
			    return array
			  } else {
			    return []
			  }
			}
		},
		onLoad(e) {
			this.logisticsFun(e.orderId)
		},
	}
</script>

<style scoped>
	/* pages/logisticsDetail/logisticsDetail.wxss */

	.page {
		padding: 40rpx;
	}

	.info-box {
		font-size: 32rpx;
		line-height: 30rpx;
	}

	.copy-img {
		width: 40rpx;
		height: 40rpx;
		margin-left: 20rpx;
	}
</style>